{% extends "base_generic.html" %}

{% block title %}我的借阅 - 本地图书馆{% endblock %}

{% block content %}
<div class="card">
    <div class="card-header text-white" style="background-color: #FFDEAD;">
        <h1 class="h3 mb-0">
            <i class="fas fa-book-reader me-2"></i>我的借阅
        </h1>
    </div>
    <div class="card-body">
        {% if bookinstance_list %}
        <div class="table-responsive">
            <table class="table table-hover">
                <thead>
                    <tr>
                        <th>书名</th>
                        <th>作者</th>
                        <th>借阅日期</th>
                        <th>应还日期</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for bookinst in bookinstance_list %}
                    <tr {% if bookinst.is_overdue %}class="table-danger"{% endif %}>
                        <td>
                            <a href="{{ bookinst.book.get_absolute_url }}" class="text-decoration-none">
                                {{ bookinst.book.title }}
                            </a>
                        </td>
                        <td>
                            <a href="{{ bookinst.book.author.get_absolute_url }}" class="text-decoration-none">
                                {{ bookinst.book.author }}
                            </a>
                        </td>
                        <td>{{ bookinst.borrower_date|date:"Y-m-d" }}</td>
                        <td>{{ bookinst.due_back|date:"Y-m-d" }}</td>
                        <td>
                            {% if bookinst.is_overdue %}
                                <span class="badge bg-danger">已逾期</span>
                            {% else %}
                                <span class="badge bg-success">借阅中</span>
                            {% endif %}
                        </td>
                        <td>
                            <button class="btn btn-sm btn-outline-primary">
                                <i class="fas fa-redo me-1"></i>续借
                            </button>
                            <button class="btn btn-sm btn-outline-success">
                                <i class="fas fa-check me-1"></i>归还
                            </button>
                        </td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
        {% else %}
        <div class="alert alert-info" role="alert">
            <i class="fas fa-info-circle me-2"></i>
            您当前没有借阅任何图书。
            <a href="{% url 'books' %}" class="alert-link">去借阅图书</a>
        </div>
        {% endif %}
    </div>
</div>

{% if is_paginated %}
<nav aria-label="分页" class="mt-4">
    <ul class="pagination justify-content-center">
        {% if page_obj.has_previous %}
        <li class="page-item">
            <a class="page-link" href="?page={{ page_obj.previous_page_number }}">
                <i class="fas fa-chevron-left"></i>
            </a>
        </li>
        {% endif %}

        {% for i in paginator.page_range %}
        <li class="page-item {% if page_obj.number == i %}active{% endif %}">
            <a class="page-link" href="?page={{ i }}">{{ i }}</a>
        </li>
        {% endfor %}

        {% if page_obj.has_next %}
        <li class="page-item">
            <a class="page-link" href="?page={{ page_obj.next_page_number }}">
                <i class="fas fa-chevron-right"></i>
            </a>
        </li>
        {% endif %}
    </ul>
</nav>
{% endif %}
{% endblock %} 